import React, { useState } from 'react';
import { ConfigProvider } from 'antd';
import { Route, Routes, BrowserRouter } from 'react-router-dom';
import { RouteConfig, routers } from './routers';
import AuthRoute from './routers/AuthRoute';
import type { Locale } from 'antd/es/locale';
// import enUS from 'antd/locale/en_US';
import zhCN from 'antd/locale/zh_CN';
import './App.css';
function App() {
  const [locale, setLocal] = useState<Locale>(zhCN);
  // 处理我们的routers
  const RouteAuthFun = (routeList: RouteConfig[]) => {
    return routeList.map(
      (item: {
        path: string;
        auth: boolean;
        element: React.ReactNode;
        children?: any;
      }) => {
        return (
          <Route
            path={item.path}
            element={
              <AuthRoute auth={item.auth} key={item.path}>
                {item.element}
              </AuthRoute>
            }
            key={item.path}
          >
            {/* 递归调用，因为可能存在多级的路由 */}
            {item?.children && RouteAuthFun(item.children)}
          </Route>
        );
      }
    );
  };
  return (
    <>
      <ConfigProvider locale={locale}>
        <Routes>{RouteAuthFun(routers)}</Routes>
      </ConfigProvider>
    </>
  );
}

export default App;
